<template>
  <el-dialog title="修改密码" width="600px" append-to-body :visible.sync="dialogedit" :before-close="closeDialog"
    :close-on-click-modal="false">
    <el-form ref="form" :model="user" :rules="rules" label-width="80px">
      <el-form-item label="旧密码" prop="oldPassword">
        <el-input v-model="user.oldPassword" placeholder="请输入旧密码" type="password" show-password />
      </el-form-item>
      <el-form-item label="新密码" prop="newPassword">
        <el-input v-model="user.newPassword" placeholder="请输入新密码" type="password" show-password />
      </el-form-item>
      <el-form-item label="确认密码" prop="confirmPassword">
        <el-input v-model="user.confirmPassword" placeholder="请确认新密码" type="password" show-password />
      </el-form-item>

    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submit()">保 存</el-button>
      <el-button @click="closeDialog">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import {
    updateUserPwd
  } from "@/api/system/user";

  export default {
    props: {
      dialogedit: {
        type: Boolean,
        default: false
      }
    },
    data() {
      const equalToPassword = (rule, value, callback) => {
        if (this.user.newPassword !== value) {
          callback(new Error("两次输入的密码不一致"));
        } else {
          callback();
        }
      };
      return {
        user: {
          oldPassword: undefined,
          newPassword: undefined,
          confirmPassword: undefined
        },
        // 表单校验
        rules: {
          oldPassword: [{
            required: true,
            message: "旧密码不能为空",
            trigger: "blur"
          }],
          newPassword: [{
              required: true,
              message: "新密码不能为空",
              trigger: "blur"
            },
            {
              min: 6,
              max: 20,
              message: "长度在 6 到 20 个字符",
              trigger: "blur"
            }
          ],
          confirmPassword: [{
              required: true,
              message: "确认密码不能为空",
              trigger: "blur"
            },
            {
              required: true,
              validator: equalToPassword,
              trigger: "blur"
            }
          ]
        }
      };
    },
    methods: {
      submit() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            const params={
              oldPassword:this.user.oldPassword,
              newPassword:this.user.newPassword
            }
            updateUserPwd(params ).then(response => {
              this.closeDialog();
              this.$modal.msgSuccess("修改成功");
            });
          }
        });
      },
      closeDialog() {
        this.$nextTick(() => {
          this.$refs.form.resetFields();
          this.$emit('update:dialogedit', !this.dialogedit);
        });
      }

    }

  };
</script>
